<template>
    <v-container class="justify-start full-height">
        <p class="title white--text">
            修改密码
            <v-btn color="info" dark class="float-right elevation-0">保存</v-btn>
        </p>
        <v-card class="mt-3">
            <v-card-title>
                <v-form
                        ref="form"
                        v-model="valid"
                        lazy-validation
                        style="width: 100%;"
                >
                    <v-row>
                        <v-col
                                cols="12"
                                sm="6"
                        >
                            <v-text-field
                                    label="密码"
                                    required
                                    :rules="[rules.required, rules.min]"
                                    v-model="params.password"
                            ></v-text-field>
                            <v-text-field
                                    label="确认密码"
                                    :rules="[rules.required, rules.min]"
                                    required
                                    v-model="params.password"
                            ></v-text-field>
                            <v-text-field
                                    label="新密码"
                                    :rules="[rules.required, rules.min]"
                                    required
                                    v-model="params.password"
                            ></v-text-field>
                        </v-col>
                    </v-row>
                </v-form>
            </v-card-title>
        </v-card>
    </v-container>
</template>

<script>
    export default {
        name: "password",
        data() {
            return {
                rules: {
                    required: value => !!value || 'Required.',
                    min: v => v.length >= 6 || 'Min 6 characters'
                },
                params: {
                    password: ''
                },
                valid: false
            }
        }
    }
</script>

<style scoped>

</style>
